// layui导入模块并得到相应模块对象
layui.use(['table', 'layer', 'form', 'jquery', 'laydate'], function () {
    let table = layui.table;
    let layer = layui.layer;
    let form = layui.form;
    let $ = layui.jquery;
    // 日期时间对象(有日期字段的话就用上)
    let laydate = layui.laydate;

    // 渲染表格
    table.render({
        //绑定表格对象
        elem: "#schoolTable",
        //请求方式
        method: "get",
        height: "full-90",
        //请求路径
        url: "/classManage/restful_classManage",
        //是否分页
        page: true,
        //表格上方普通工具栏
        toolbar: "#complain_toolbar",
        //每页的行数
        limit: 5,
        //显示数据的表列
        cols: [[
            //开启多选框
            {checkbox: true}
            //数据列
            , {field: 'claId', title: '报班编号',  align: "center", sort: true}
            , {field: 'studentName', title: '学员姓名',  align: "center"}
            , {field: 'className', title: '班级名称',  align: "center"}
            , {field: 'schoolName', title: '校区名称',  align: "center"}
            , {field: 'claDates', title: '报班日期',  align: "center"}
            ,
            //行尾的操作按钮
            {fixed: "right", title: "操作", width: 150, toolbar: "#barDemo"}
        ]],
        //分页工具栏中每页行数选择器
        limits: [5, 10, 15, 20]
    });

    // 监听：添加/修改页面的表单提交操作[保存按钮]
    // 定义全局变量：页面操作方式
    let method = "";
    form.on("submit(formSave)", function (data) {
        // 将表单中各字段转化为Json字符串
        let dataStr = JSON.stringify(data.field);
        // 使用ajax提交数据
        $.ajax({
            type: method,
            url: "/classManage/restful_classManage",
            data: dataStr,
            dataType: "text",
            contentType: "application/json;charset=utf-8",
            success: function (msg) {
                layer.closeAll(); // 关闭对话框
                layer.msg(msg); // 弹出提示框
                table.reload("schoolTable"); // 重新刷新数据表格
            }
        });
        return false;
    });

    //表格头部上方的普通工具栏中按钮事件：根据按钮中lay-event中的属性值判断
    table.on("toolbar(schoolList)", function (obj) {
        // 检查表格的选择操作状态
        let checkStatus = table.checkStatus(obj.config.id);
        // 判断事件event的值
        switch (obj.event) {
            // 批量删除：删除选定的多行数据
            case "batchDel":
                // 得到表格中选定的行
                let data = checkStatus.data;
                // 判断选择行的数量
                if (data.length > 0) {
                    // 弹出提示对话框
                    layer.confirm("请确认是否真的删除?", function (index) {
                        //定义一个删除数据的主键值字符串
                        let schoolIdStr = "";
                        //获取所有选择行的主键值(claId)
                        for (let i = 0; i < data.length; i++) {
                            schoolIdStr += data[i].claId + ",";
                        }
                        //去掉末尾的,号
                        schoolIdStr = schoolIdStr.substring(0, schoolIdStr.length - 1);
                        //关闭确认对话框
                        layer.close(index);
                        //使用ajax删除所选中的多行数据
                        $.ajax({
                            type: "put",
                            url: "/classManage/batchDel?schoolIdStr=" + schoolIdStr,
                            success: function (msg) {
                                //弹出提示框
                                layer.msg(msg);
                                //刷新表格数据
                                table.reload("schoolTable");
                            }
                        });
                    });
                } else {
                    //弹出提示框
                    layer.msg("请至少选择一行...");
                }
                break;
            case "add":
                // 显示添加界面
                method = "post";
                // 清空表单中原有内容
                $("#schoolForm")[0].reset();
                // 弹出对话框
                layer.open({
                    type: 1, // 外部页面为2，内部层为1
                    title: "添加新报班记录",
                    area:['32%',''],
                    fix: false,
                    maxmin: true, //最大最小化
                    shade: 0.3,
                    shadeClose: true,
                    //加上边框
                    skin: "layui-layer-rim",
                    //指定弹层的网页代码
                    content: $("#data-main").html()
                });
                //将主键列设置成允许修改[防止用户先操作修改，后增加 原因是避免主键字段值被设置为只读]
                $("input[name='claId']").attr("readonly", false);
                break;
        }
    });

    /*
      监听 表格数据行尾部的按钮操作事件
      此处代码不能和前面代码写在一起，原因是二者的参数是区别的
      表格头部上方是普通的工具栏：toolbar() ;数据行尾部的按钮：tool()
       */
    table.on("tool(schoolList)", function (obj) {
        //得到表格行数据
        let data = obj.data;
        //判断事件event值，此处采用if..else if
        if (obj.event === "update") {
            //设置操作方式
            method = "put";
            //设置弹层界面信息
            layer.open({
                type: 1,
                title: "修改报班记录",
                area: ['32%', ''],
                fix: false,
                maxmin: true, //最大最小化
                shade: 0.3,
                shadeClose: true,
                //加上边框
                skin: "layui-layer-rim",
                content: $("#data-main").html()
            });
            // 把数据行中的数据放到表单各字段中
            form.val("schoolFormTest", {
                "claId": data.claId,
                "studentName": data.studentName,
                "className": data.className,
                "claDates": data.claDates
            });
            //将主键字段值设置为只读，不允许修改
            $("input[name='claId']").attr("readonly", true);
        } else if (obj.event === "delete") {
            //删除确认
            layer.confirm("是否真的删除报班编号为：" + data.claId + " 的这行数据?", function (index) {
                //把网页上表格中该行数据删除
                obj.del();
                // 关闭对话框
                layer.close(index);
                //使用ajax到后台删除数据库表中该行数据
                $.ajax({
                    type: "delete",
                    url: "/classManage/restful_classManage/" + data.claId, // 把要删除的报班编号放在路径中作为路径参数
                    //操作成功后回调操作
                    success: function (msg) {
                        layer.msg(msg);
                        //重新加载表格数据
                        table.reload("schoolTable");
                    }
                });
            });
        }
    });

    //多条件查询
    form.on("submit(provinceSearch)", function (obj) {
        //得到表单中的数据
        let data = obj.field;
        //重新加载表格对象
        table.reload("schoolTable", {
            //页码
            page: {
                curr: 1
            },
            // 多条件数据
            where: {
                "className": data.className
            }
        });
        return false;
    });
});